<template>
	<view class="container">
		<view class="tagBox">
			<view class="tagIcon"></view>
			<text>费率</text>
		</view>
		<view class="tableContent">
			<uni-table border stripe emptyText="暂无更多数据">
				<!-- 表头行 -->
				<uni-tr>
					<uni-th align="center" width="120">交易类型</uni-th>
					<uni-th align="center" width="120">标准费率(T0)</uni-th>
				</uni-tr>
				<!-- 表格数据行 -->
				<uni-tr>
					<uni-td align="center">贷记卡刷卡</uni-td>
					<uni-td align="center">{{ rateInfo.ysfCreditCard }}%</uni-td>

				</uni-tr>
				<uni-tr>
					<uni-td align="center">借记卡刷卡</uni-td>
					<uni-td align="center">{{ rateInfo.ysfDebitCard }}%</uni-td>

				</uni-tr>
				<uni-tr>
					<uni-td align="center">银联二维码</uni-td>
					<uni-td align="center">{{ rateInfo.ysf }}%</uni-td>

				</uni-tr>
				<uni-tr>
					<uni-td align="center">微信</uni-td>
					<uni-td align="center">{{ rateInfo.wechat }}%</uni-td>

				</uni-tr>
				<uni-tr>
					<uni-td align="center">支付宝</uni-td>
					<uni-td align="center">{{ rateInfo.alipay }}%</uni-td>

				</uni-tr>

			</uni-table>
		</view>
	</view>
	<view class="btn-list">
		<view class="btn-base w200 gray" @click="childUpBtn()">上一步</view>
		<view class="btn-base w470 blue" @click="childNextBtn()">下一步</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted,
		defineProps,
		reactive
	} from "vue";
	import {
		useStore
	} from "@/store/index";
	import {
		showModal,
		showToast
	} from "@/utils/toast";
	import {
		onLoad
	} from "@dcloudio/uni-app";
	import {
		queryRateInfo
	} from '@/api/common'
	// 定义要触发的事件
	const emit = defineEmits(['upBtn', 'nextBtn']);
	onLoad(async () => {

	});
	onMounted(() => {
		// 获取详情
		getRate();
	});
	// 费率信息
	const rateInfo = reactive({
		ysfCreditCard: null,
		ysfDebitCard: null,
		ysf: null,
		wechat: null,
		alipay: null
	})
	const props = defineProps({
		// 设备SN
		scanResult: {
			type: String,
			default: null,
		},
	});
	const childUpBtn = () => {
		emit('upBtn');
	}
	const childNextBtn = () => {
		emit('nextBtn', rateInfo, 5)
	}
	let getRate = () => {
		console.log("props.scanResult", props.scanResult)
		queryRateInfo(props.scanResult).then((res) => {
			console.log("res-8888888888", res)
			rateInfo.ysfCreditCard = res.poscreditRate
			rateInfo.ysfDebitCard = res.posdebitRate
			rateInfo.ysf = res.ylCodelessRate
			rateInfo.wechat = res.wxrate
			rateInfo.alipay = res.zfbrate

		})
	}
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>